<template>
	<div class="app-container">
		<!--<doc-alert title="定时任务" url="https://doc.iocoder.cn/job/" />
		<doc-alert title="异步任务" url="https://doc.iocoder.cn/async-task/" />
		<doc-alert title="消息队列" url="https://doc.iocoder.cn/message-queue/" />-->
		<!-- 搜索栏 -->
		<jk-operation-card ref="box1">
			<div class="flex-between-center">
				<div class="flex-start-center">
					<!--<el-button
						v-hasPermi="['infra:job:export']"
						type="warning"
						icon="el-icon-download"
						size="mini"
						@click="handleExport"
					>导出</el-button>-->
				</div>
				<div class="flex-start-center">
					<el-input v-model="searchParams.handlerName" size="small" class="search-bar-item-size2 item-gap" placeholder="请输入处理器的名字" clearable @keyup.enter.native="handleQuery" />
					<el-date-picker v-model="searchParams.beginTime" size="small" class="search-bar-item-size2 item-gap" clearable type="date" value-format="yyyy-MM-dd" placeholder="选择开始执行时间" />
					<el-date-picker v-model="searchParams.endTime" size="small" class="search-bar-item-size2 item-gap" clearable type="date" value-format="yyyy-MM-dd" placeholder="选择结束执行时间" />
					<el-select v-model="searchParams.status" size="small" class="search-bar-item-size2 item-gap" placeholder="请选择任务状态" clearable>
						<el-option
							v-for="dict in getDictDatas(DICT_TYPE.INFRA_JOB_LOG_STATUS)"
							:key="dict.value"
							:label="dict.label"
							:value="dict.value"
						/>
					</el-select>
					<!--<right-toolbar :show-search.sync="showSearch" @queryTable="getList"></right-toolbar>-->
					<el-button size="small" type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button>
					<el-button size="small" icon="el-icon-refresh" @click="resetQuery">重置</el-button>
				</div>
			</div>
		</jk-operation-card>

		<jk-card class="margin-top-10">
			<el-table v-loading="loading" :height="tableHeight + 20" size="mini" :data="list">
				<el-table-column label="日志编号" align="center" prop="id" />
				<el-table-column label="任务编号" align="center" prop="jobId" />
				<el-table-column label="处理器的名字" align="center" prop="handlerName" />
				<el-table-column label="处理器的参数" align="center" prop="handlerParam" />
				<el-table-column label="第几次执行" align="center" prop="executeIndex" />
				<el-table-column label="执行时间" align="center" width="180">
					<template #default="scope">
						<span>{{ parseTime(scope.row.beginTime) + ' ~ ' + parseTime(scope.row.endTime) }}</span>
					</template>
				</el-table-column>
				<el-table-column label="执行时长" align="center" prop="duration">
					<template #default="scope">
						<span>{{ scope.row.duration + ' 毫秒' }}</span>
					</template>
				</el-table-column>
				<el-table-column label="任务状态" align="center" prop="status">
					<template #default="scope">
						<dict-tag :type="DICT_TYPE.INFRA_JOB_LOG_STATUS" :value="scope.row.status" />
					</template>
				</el-table-column>
				<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
					<template #default="scope">
						<el-button
							v-hasPermi="['infra:job:query']"
							size="mini"
							type="text"
							icon="el-icon-view"
							:loading="exportLoading"
							@click="handleView(scope.row)"
						>详细</el-button>
					</template>
				</el-table-column>
			</el-table>
			<!-- 分页组件 -->
			<div ref="box2" class="flex-end-center margin-top-10">
				<jk-page
					:page-index="searchParams.pageNo"
					:page-size="searchParams.pageSize"
					:total="total"
					@on-change="onPageChange"
				/>
			</div>
		</jk-card>
		<!-- 调度日志详细 -->
		<el-dialog title="调度日志详细" :visible.sync="open" width="700px" append-to-body>
			<el-form ref="form" :model="form" label-width="120px" size="mini">
				<el-row>
					<el-col :span="12">
						<el-form-item label="日志编号：">{{ form.id }}</el-form-item>
						<el-form-item label="任务编号：">{{ form.jobId }}</el-form-item>
						<el-form-item label="处理器的名字：">{{ form.handlerName }}</el-form-item>
						<el-form-item label="处理器的参数：">{{ form.handlerParam }}</el-form-item>
						<el-form-item label="第几次执行：">{{ form.executeIndex }}</el-form-item>
						<el-form-item label="执行时间：">{{ parseTime(form.beginTime) + ' ~ ' + parseTime(form.endTime) }}</el-form-item>
						<el-form-item label="执行时长：">{{ form.duration + ' 毫秒' }}</el-form-item>
						<el-form-item label="任务状态：">
							<dict-tag :type="DICT_TYPE.INFRA_JOB_LOG_STATUS" :value="form.status" />
						</el-form-item>
						<el-form-item label="执行结果：">{{ form.result }}</el-form-item>
					</el-col>
				</el-row>
			</el-form>
			<div slot="footer" class="dialog-footer">
				<el-button @click="open = false">关 闭</el-button>
			</div>
		</el-dialog>
	</div>
</template>

<script>
    import { getJobLogPage, exportJobLogExcel } from '@/api/infra/jobLog';
    import { getDictDatas, DICT_TYPE } from '@/utils/dict';
    import RightToolbar from '@/components/RightToolbar';
    // 字典标签组件
    import DictTag from '@/components/DictTag';
    import DocAlert from '@/components/DocAlert';
    import { parseTime } from '../../../utils/ruoyi';
    import Pagination from '@/components/Pagination';
    import hasPermi from '@/directive/permission/hasPermi';
    import calHeight from '../../../mixins/cal-table-height';
    import { pageConfig } from '../../../utils/jk/jk-tool';
    export default {
        name: 'InfraJobLog',
        mixins: [calHeight],
        directives: {
            hasPermi
        },
        components: {
            Pagination,
            DocAlert,
            DictTag,
            RightToolbar
        },
        data() {
            return {
                parseTime: parseTime,
                getDictDatas: getDictDatas,
                DICT_TYPE: DICT_TYPE,
                // 遮罩层
                loading: true,
                // 导出遮罩层
                exportLoading: false,
                // 显示搜索条件
                showSearch: true,
                // 总条数
                total: 0,
                // 调度日志表格数据
                list: [],
                // 是否显示弹出层
                open: false,
                // 表单参数
                form: {},
                // 查询参数
                searchParams: {
                    pageNo: 1,
                    pageSize: pageConfig.pageSize,
                    handlerName: null,
                    beginTime: null,
                    endTime: null,
                    status: null
                }
            };
        },
        activated() {
            this.searchParams.jobId = this.$route.query && this.$route.query.jobId;
            this.getList();
        },
        methods: {
            onPageChange(pageIndex, pageSize) {
                this.searchParams.pageNo = pageIndex;
                this.searchParams.pageSize = pageSize;
                this.getList();
            },
            /** 查询调度日志列表 */
            getList() {
                this.loading = true;
                getJobLogPage({
                    ...this.searchParams,
                    beginTime: this.searchParams.beginTime ? this.searchParams.beginTime + ' 00:00:00' : undefined,
                    endTime: this.searchParams.endTime ? this.searchParams.endTime + ' 23:59:59' : undefined
                }).then(res => {
                    this.list = res.data.res;
                    this.total = res.data.count;
                    this.loading = false;
                }
                );
            },
            /** 搜索按钮操作 */
            handleQuery() {
                this.searchParams.pageNo = 1;
                this.getList();
            },
            /** 重置按钮操作 */
            resetQuery() {
                // this.resetForm('queryForm');
                this.handleQuery();
            },
            /** 详细按钮操作 */
            handleView(row) {
                this.open = true;
                this.form = row;
            },
            /** 导出按钮操作 */
            handleExport() {
                // 处理查询参数
                const params = { ...this.searchParams,
                                 beginTime: this.searchParams.beginTime ? this.searchParams.beginTime + ' 00:00:00' : undefined,
                                 endTime: this.searchParams.endTime ? this.searchParams.endTime + ' 23:59:59' : undefined
                };
                params.pageNo = undefined;
                params.pageSize = undefined;
                // 执行导出
                this.$modal.confirm('是否确认导出所有定时任务日志数据项?').then(() => {
                    this.exportLoading = true;
                    return exportJobLogExcel(params);
                }).then(res => {
                    this.$download.excel(res.data, '定时任务日志.xls');
                    this.exportLoading = false;
                }).catch(() => {});
            }
        }
    };
</script>
